@mixin flex($x-alignment, $y-alignment) {
    display: flex;
    align-items: $y-alignment;
    justify-content: $x-alignment;
}

$navFontColor: #F2B535;
$titleH2Color: #494d55;
$titlePColor: #919191;

/* 导航栏 */
.navbar {
    a {
        color: white;
    }

    a:hover {
        color: $navFontColor;
    }

}


.bg-body-tertiary {
    background-color: transparent !important;

    .navbar-collapse {
        flex-grow: 0;
    }
}

.navbar-custom {
    background-color: #494d55 !important;
}


/* 轮播图 */
.carousel {
    @media (max-width: 768px) {
        .carousel-item {
            height: 250px;
        }
    }

    @media (min-width: 768px) {
        .carousel-item {
            height: 400px;
        }
    }

    @media (min-width: 992px) {
        .carousel-item {
            height: 500px;
        }
    }

    .carousel-item {
        background: {
            size: cover;
            position: center 0;
        }
    }

    .carousel-item:nth-child(1) {
        background-image: url(../assets/uploads/banner_1.jpg);
    }

    .carousel-item:nth-child(2) {
        background-image: url(../assets/uploads/banner_2.jpg);
    }

    .carousel-item:nth-child(3) {
        background-image: url(../assets/uploads/banner_3.jpg);
    }

    .carousel-item:nth-child(4) {
        background-image: url(../assets/uploads/banner_4.jpg);
    }
}

/* 开源项目 */
.project {
    margin-top: 60px;
    text-align: center;

    .title {
        h2 {
            font-size: 30px;
            color: $titleH2Color;
        }

        p {
            color: $titlePColor;
        }
    }

    // width > 992px 一行显示四个 col-lg-3
    // width > 768x 一行显示两个 col-md-6
    .content {
        .row {
            div {
                margin-bottom: 15px;
                a {
                    color: white;
                    text-decoration: none;
                    display: block;
                    height: 200px;
                    border-radius: 4px;
                    padding: 20px 10px;

                    img {
                        height: 60px;
                    }

                    h3 {
                        margin: 20px 0 10px;
                    }
                }
                &:nth-child(1) a {
                    background-color: #70c3ff;
                };
                &:nth-child(2) a {
                    background-color: #fd6a7f;
                };
                &:nth-child(3) a {
                    background-color: #7f8ea0;
                };
                &:nth-child(4) a {
                    background-color: #89d04f;
                }
            }

           
        }
    }
}